// Learn TypeScript:
//  - https://docs.cocos.com/creator/2.4/manual/en/scripting/typescript.html
// Learn Attribute:
//  - https://docs.cocos.com/creator/2.4/manual/en/scripting/reference/attributes.html
// Learn life-cycle callbacks:
//  - https://docs.cocos.com/creator/2.4/manual/en/scripting/life-cycle-callbacks.html

import { Config } from "../util/Config";
import { Tools } from "../util/Tools";


const { ccclass, property } = cc._decorator;

@ccclass
export default class HallJoinRoomController extends cc.Component {

    @property(cc.Node)
    errorLabel: cc.Node = null;
    @property(cc.EditBox)
    editBox: cc.EditBox = null   //文本输入框
    @property(cc.Node)
    buttonNoClick: cc.Node = null; //join 按钮（不可点击）
    @property(cc.Node)
    buttonReady: cc.Node = null; //join 按钮（可点击）



    newText: string = ''
    originalPlaceholder: string = ''

    skillsClick: Function = null
    callback: Function;

    // 用于延迟隐藏错误提示的回调，便于取消已安排的任务
    private _hideErrorLabelCallback = () => {
        if (this.errorLabel) {
            this.errorLabel.active = false;
        }
    }


    // onLoad () {}

    start() {

        Tools.yellowButton(this.buttonReady, () => {
            //点击加入房间
            if (this.callback) {
                this.callback(this.newText);
            }
        })

        Tools.grayButton(this.buttonNoClick, () => { })

    }

    protected onEnable(): void {
        this.destroyEditBox()
        this.editBox.node.on('text-changed', this.onTextChanged, this);
        this.editBox.node.on('editing-did-began', this.onEditingBegan, this);
        this.editBox.node.on('editing-did-ended', this.onEditingEnded, this);
        this.buttonStyle(false);

    }
    protected onDisable(): void {
        this.destroyEditBox()
        this.editBox.string = ''
        this.errorLabel.active = false
        // 组件失活时，取消已安排的隐藏任务
        this.unschedule(this._hideErrorLabelCallback)
        // 恢复 placeholder 显示
        if (this.editBox['_N$placeholderLabel']) {
            this.editBox['_N$placeholderLabel'].node.opacity = 255;
        }
        // 恢复 placeholder 文本
        if (this.originalPlaceholder) {
            this.editBox.placeholder = this.originalPlaceholder;
        }
    }

    onTextChanged() {
        // 当 EditBox 的文本发生变化时执行这里的代码
        this.newText = this.editBox.string;
        this.errorLabel.active = false
        if (this.newText.length > 0) {
            this.buttonStyle(true);
        } else {
            this.buttonStyle(false);
        }
    }

    onEditingBegan() {
        // 开始编辑时隐藏 placeholder
        console.log("EditBox editing began");

        // 方法1: 通过设置透明度隐藏
        const placeholderLabel = this.editBox['_N$placeholderLabel'];
        if (placeholderLabel) {
            console.log("Hiding placeholder via opacity");
            placeholderLabel.node.opacity = 0;
        }

        // 方法2: 通过设置 placeholder 文本为空
        if (this.editBox.placeholder && this.originalPlaceholder === '') {
            this.originalPlaceholder = this.editBox.placeholder;
        }
        this.editBox.placeholder = '';
        console.log("Placeholder text cleared");
    }

    onEditingEnded() {
        // 结束编辑时，如果没有文本则显示 placeholder
        console.log("EditBox editing ended, text length:", this.editBox.string.length);

        if (this.editBox.string.length === 0) {
            // 方法1: 恢复透明度
            const placeholderLabel = this.editBox['_N$placeholderLabel'];
            if (placeholderLabel) {
                console.log("Showing placeholder via opacity");
                placeholderLabel.node.opacity = 255;
            }

            // 方法2: 恢复 placeholder 文本
            if (this.originalPlaceholder) {
                this.editBox.placeholder = this.originalPlaceholder;
                console.log("Placeholder text restored");
            }
        }
    }

    destroyEditBox() {
        this.editBox.node.off('text-changed', this.onTextChanged, this);
        this.editBox.node.off('editing-did-began', this.onEditingBegan, this);
        this.editBox.node.off('editing-did-ended', this.onEditingEnded, this);
    }

    private buttonStyle(isEnter: boolean) {
        if (isEnter) {
            this.buttonReady.active = true
            this.buttonNoClick.active = false
        } else {
            this.buttonReady.active = false
            this.buttonNoClick.active = true

        }

    }

    //加入房间失败
    joinError() {
        // 先显示错误标签
        this.errorLabel.active = true
        // 取消之前可能安排的隐藏任务，避免重复调度
        this.unschedule(this._hideErrorLabelCallback)
        // 2秒后自动隐藏
        this.scheduleOnce(this._hideErrorLabelCallback, 2)
    }

    //设置点击道具 item 按钮的回调
    setButtonClick(callback: Function) {

        this.callback = callback; //点击加入房间的按钮
    }


    // update (dt) {}
}
